<!DOCTYPE html>

<html>



<head>

<meta charset="UTF-8">

<title>Test</title>

<link rel="stylesheet" type="text/css" href="styles.css" />


</head>


<nav>
<h1>
<a href="index.html">Accueil</a>
<a href="page2.html">Page2</a>
<a href="page3.html">Page3</a>
<a href="page4.html">Page4</a>
</h1>
</nav>

<body>

<img alt="un Koala" src="Koala.jpg" width="200" >



<audio src="maid.mp3" autoplay loop>
</audio>


<header>
<h2>Hello <em>Romino !!!!</em></h2>

</header>





<h3>

<label for="ma planete">Votre planète de <small>naissançe</small></label>
<input type="text" name="maplanete" id="maplanete" list="planetes">

<datalist id="planetes">
<option value="Mercure">
<option value="Vénus">
<option value="Terre">
<option value="Mars">
<option value="Jupiter">
<option value="Saturne">
<option value="Uranus">
<option value="Neptune">
</datalist>
</h3>


<h4>
<label for="recherche">Rechercher</label>
<input type="search" name="recherche" id="recherche">
<input type="submit" value="parcourir">
</h4>


<h5>
<label for="note">Votre note</label>
<input id="note" name="note" type="range" min="1" max="10" value="5">
</h5>


<h6>
<label for="dtstart">Date de départ</label>
<input id="dtstart" name="dtstart" type="date">
</h6>




<div align="left">
<label for="time">Time</label>
<input id="time" name="time" type="time">
</div>



<div align="justify">
<fieldset>
<legend><i>Emails</i></legend>
<form action="" method="post">
<em>Email obligatoire : </em>
<input type="email" name="mail" required>
<br>
<input type="submit" value="OK">
</form>
</fieldset>
</div>


<div align="right">
<fieldset>
<legend><i>Nom</i></legend>
<form action="" method="post">
<em>Nom : </em>
<input type="text" name="nom" required>
<br>
<input type="submit" value="OK">
</form>
</fieldset>
</div>

<div>

Voici un texte <span class="green"> avec une phrase en gras et vert</span>
 alors que le reste ne change pas 
 



</div>

<footer>
Je m'apelle <em>Romain</em>
<span class="purple">c'est la fin</span>
</footer>











</body>



</html>